import React, { createContext } from 'react'
const { Provider, Consumer } = createContext()
// 跨级组件通信
class Child extends React.Component {
  render() {
    return <Consumer>{(color) => <div>我是child---{color}</div>}</Consumer>
  }
}
class SubNode extends React.Component {
  render() {
    return (
      <div>
        我是subnode
        <Child></Child>
      </div>
    )
  }
}
class Node extends React.Component {
  render() {
    return (
      <div>
        我是node
        <SubNode></SubNode>
      </div>
    )
  }
}
export default class App extends React.Component {
  render() {
    return (
      <Provider value="blue">
        <>
          我是app
          <Node></Node>
        </>
      </Provider>
    )
  }
}
